<template>
  <div>
    <header>{{ msg }}</header>
    <section>
      <el-button @click="obj.a += 1">触发computed</el-button>
      {{ newMsg }}
    </section>
    <div v-testdir="{ name: 123, age: 18,inx }" class="testClass" style="width:100px;height:100px;background:#eee">
      <div v-for="(item, index) in 5" :key="index" @click="testClick(index)" class="child">
        {{ index }}
      </div>
    </div>
    <div>{{inx}}</div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      msg: 1,
      obj: {
        a: 1,
        b: "b",
      },
      inx:0
    };
  },
  computed: {
    newMsg() {
      // console.log('computed的打印',this.obj.a);
      // console.log(this.obj.a);
      return this.obj.a;
    },
  },
  watch: {
    newMsg(val, old) {
      console.log("222", val, old);
    },
  },
  methods: {
    changeMsg() {
      this.msg += 1;
    },
    testClick(index) {
        this.inx = index
        console.log('点击---',index);
    }
  },
  created() {
    console.log(111, this.$route);
  },
};
</script>

<style>
</style>